<template>
  <div  class="main-width container-center mt-5" :style="{minHeight: height + 'px'}">
    <p class="event-details-title">{{info.basicTitle}}</p>
    <p class="list-footer-fs tc" style="margin-bottom: 8px;">
      <time class="time" style="margin-right: 50px;">{{$formatDateTime(info.ctime)}}</time>
      <span class="el-icon-view"></span><span class=""  style="padding-top: 3px;margin-right: 15px;">{{info.browseNumber}}</span>
      <span class="el-icon-edit-outline"></span><span class="" >{{info.comments}}</span>
    </p>
    <!-- <p class="list-footer-fs tc">
      活动类型：{{info.basicType === 'ACTIVITY' ? '活动' : '会议'}}
    </p> -->
    <p class="list-footer-fs tc" style="margin-bottom: 8px;" v-if="info.basicType === 'ACTIVITY'|| info.basicType === 'MEETING'">
      活动时间：{{$formatYMD(info.activityStartTime)}} - {{$formatYMD(info.activityEndTime)}}
    </p>
    <p class="list-footer-fs tc" style="margin-bottom: 16px;" v-if="info.basicType === 'ACTIVITY'|| info.basicType === 'MEETING'">
      报名时间：{{$formatYMD(info.signStartTime)}} - {{$formatYMD(info.signEndTime)}}
    </p>
    <div class="tc" v-show="info.activityStatus === 'START' && isVip">
      <el-button type="success" round style="min-width: 200px;" @click="signUp"
      v-if="info.basicType === 'ACTIVITY'|| info.basicType === 'MEETING'">
      <span v-show="info.signStatus === 'NOT'">参加活动</span>
      <span v-show="info.signStatus === 'SAVE'">已填写表单，未提交报名</span>
      <span v-show="info.signStatus === 'SUBMIT'">已报名,查看报名详情</span>
    </el-button>
    </div>
    <div id="event-details-content" style="padding-top: 50px;" v-html="info.activityContent"></div>
    <div class="fr">
      <el-button type="success" plain round @click="liked()" style="margin-bottom: 20px;" :loading="likeloading">
        <span>{{info.like === 0 ? '点赞' : '已点赞'}}</span> |
        <span>{{info.likeNumber}}</span>
      </el-button>
    </div>
    <div class="" v-if="info.isComment === 'YES'">
      <comments :coms.sync="info.coms" :info="info" modelType="activity"></comments>
    </div>
    <back-top></back-top>
  </div>
</template>

<script>
import axios from 'axios'

let gen = async function (self, params) {
  // debugger
  // self.info = Object.assign({}, self.info, params)
  self.info.modelId = params.id
  self.info.basicType = params.basicType
  self.info.browseNumber = params.browseNumber
  self.info.comments = params.comments
  self.info.ctime = parseInt(self.info.ctime)
  let conpara = {}
  if (self.info.basicType === 'ACTIVITY' || self.info.basicType === 'MEETING') {
    // conpara.activityId = params.modelId || params.activityId
    conpara.activityId = params.id
  } else {
    // conpara.informationId = params.modelId || params.informationId
    conpara.informationId = params.id
  }
  if (self.$store.state.user.isLogin) {
    conpara.userId = self.$store.state.user.user.user.userId
  }
  // 请求当前登录人和或从的关系
  if (self.isLogin && (self.info.basicType === 'ACTIVITY'|| self.info.basicType === 'MEETING')) {
    let signRes = await axios.post('/mscs/activity/findUserActivitySignStatus', self.$paramsConvert(conpara))
    self.info.signStatus = signRes.data.data
  }

  if (self.info.basicType === 'ACTIVITY' || self.info.basicType === 'MEETING') {
    let url = '/mscs/activity/findActivityContentById'
    // 请求内容
    let res = await axios.post(url, self.$paramsConvert(conpara))

    self.info.like = parseInt(res.data.data.like)
    self.info.likeNumber = parseInt(res.data.data.likeNumber)
    self.info.activityContent = res.data.data.data.activityContent
    self.info.activityStatus = res.data.data.data.activityStatus
    self.info.activityStartTime = res.data.data.data.activityStartTime
    self.info.activityEndTime = res.data.data.data.activityEndTime
    self.info.activityLogo = res.data.data.data.activityLogo
    self.info.basicTitle = res.data.data.data.activityTitle
    self.info.ctime = res.data.data.data.ctime
    self.info.isPublish = res.data.data.data.isPublish
    self.info.signEndTime = res.data.data.data.signEndTime
    self.info.signStartTime = res.data.data.data.signStartTime
    self.info.updateTime = res.data.data.data.updateTime
    self.info.basicType = res.data.data.data.activityType
    self.info.isComment = res.data.data.data.isComment
  } else {

    let url = '/mscs/information/findInformationContentById'
    // 请求内容
    let res = await axios.post(url, self.$paramsConvert(conpara))
    self.info.like = parseInt(res.data.data.like)
    self.info.likeNumber = parseInt(res.data.data.likeNumber)
    self.info.activityContent = res.data.data.data.informationDetails
    self.info.basicTitle = res.data.data.data.informationTitle
    self.info.ctime = res.data.data.data.ctime
    self.info.updateTime = res.data.data.data.updateTime
    self.info.isComment = res.data.data.data.isComment
  }

  // 请求评论
  if (self.info.isComment === 'YES') {
    // debugger
    if (self.info.basicType === 'ACTIVITY' || self.info.basicType === 'MEETING') {
      let comresUrl = '/mscs/activity/findCommentByType'
      // let comres = await axios.post(comresUrl, self.$paramsConvert({activityId: self.info.modelId || self.info.activityId}))
      let comres = await axios.post(comresUrl, self.$paramsConvert({activityId: params.id}))
      self.info.coms = comres.data.data
    } else {
      let comresUrl = '/mscs/information/findCommentByType'
      // let comres = await axios.post(comresUrl, self.$paramsConvert({informationId: self.info.modelId}))
      let comres = await axios.post(comresUrl, self.$paramsConvert({informationId: params.id}))
      self.info.coms = comres.data.data
    }

  }


}
  export default {
    title: '活动详情',
    name: 'event-details',
    data () {
      return {
        info: {
          signStatus: 'NOT',
          activityStatus: '',
          basicTitle: '',
          ctime: 0,
          browseNumber: 0,
          comments: 0,
          like: 0,
          likeNumber: 0,
          activityContent: '',
          coms: []
        },
        likeloading: false // 点在的按钮禁止
      }
    },
    props: {
      data: {}
    },
    mounted () {
      if (!this.isVip && this.$store.state.user.isLogin) {
        this.getUserType()
      }
    },
    beforeRouteEnter (to, from, next) {
     next(vm => {
       // debugger
       // if (param.ctime) {
         // 调取查询内容，开始加载数据
         vm.allGen(to.query)
       // }
     })
    },
    methods: {
      signUp () {
        if (!this.isLogin) {
          this.$openLogin()
          return
        }
        this.info.pagename = '活动报名'
        this.$router.push({name: 'eventform', params: this.info})
      },
      allGen(params) {
        gen(this, params).then(() => {}).catch((error) => {
          this.$catchError(error)
        })
      },
      // 点赞
      liked () {
        if (!this.isLogin) {
          this.$openLogin()
        } else {
          // debugger
          this.likeloading = true
          if (this.info.basicType === 'ACTIVITY' || this.info.basicType === 'MEETING') {
            let url = '/mscs/activity/userLikeOrCancel'
            axios.post(url, this.$paramsConvert({
              type: this.info.like === 0 ? 'LIKE' : 'CANCEL',
              activityId: this.info.modelId || this.info.activityId,
              userId: this.$store.state.user.user.user.userId
            })).then((res) => {
              if (res.data.code === 1) {
                if (this.info.like === 0) {
                  this.info.like = 1
                  this.info.likeNumber = parseInt(this.info.likeNumber) + 1
                } else {
                  this.info.like = 0
                  this.info.likeNumber = parseInt(this.info.likeNumber) - 1
                }
              }
            }).catch((error) => {
              // debugger
              this.$catchError(error)
            }).finally(() => {
              this.likeloading = false
            })
          } else {
            let url = '/mscs/information/userLikeOrCancel'
            axios.post(url, this.$paramsConvert({
              type: this.info.like === 0 ? 'LIKE' : 'CANCEL',
              informationId: this.info.modelId || this.info.activityId,
              userId: this.$store.state.user.user.user.userId
            })).then((res) => {
              if (res.data.code === 1) {
                if (this.info.like === 0) {
                  this.info.like = 1
                  this.info.likeNumber = parseInt(this.info.likeNumber) + 1
                } else {
                  this.info.like = 0
                  this.info.likeNumber = parseInt(this.info.likeNumber) - 1
                }
              }
            }).catch((error) => {
              this.$catchError(error)
            }).finally(() => {
              this.likeloading = false
            })
          }
        }
      },
      getUserType () {
        axios.post('/mscs/user/findUserType', this.$paramsConvert({userId: this.$store.state.user.user.user.userId})).then((res) => {
          if (res.data.code === 1) {
            this.$store.commit('upUserType', {userType: res.data.data.userType})
          }
        })
      },
    },
    watch: {
      'isLogin' (val) {
        if (val) {
          axios.post('/mscs/activity/findUserActivitySignStatus', self.$paramsConvert(conpara)).then(res => {
            this.info.signStatus = res.data.data
          })

        }
      }
    },
    computed: {
      isLogin () {
        return this.$store.state.user.isLogin
      },
      height () {
        let height = this.$store.state.height.client - this.$store.state.height.header - this.$store.state.height.footer
        return height < 500 ? 500 : height
      },
      isVip () {
        return this.$store.state.user.user &&
        (this.$store.state.user.user.user.userType === 'MEMBER' || this.$store.state.user.user.user.userType === 'CMEMBER') &&
        this.$store.state.user.user.memberStatus === "NORMAL"
      },
    }
  }
</script>
<style>
  .event-details-title {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
  }
  #event-details-content img {
    max-width: 1260px;
  }
</style>
